<%@ include file="/includes/commonHeader.jsp"%>

<script src="<%=request.getContextPath() %>/js/jquery-1.7.2.min.js"></script>
<script src="<%=request.getContextPath() %>/js/combox.js"></script>

<script type="text/javascript">

function saveContact(){
	document.getElementById("action").value="save";
	document.forms[0].submit();
}
function cargarCombox(){
	
	var select_dep = document.getElementById("departamento");
	var item_select = select_dep[select_dep.selectedIndex].value;
// 	alert("selecionado " + item_select );
	doAjaxPost(item_select);

}

</script>

<h3>Spring MVC - jQuery </h3>
<h4>AJAX version</h4>

<div id=pagetitle align=left>New Contract.</div><hr>

<form:form action="newContact.html" method="POST" commandName="contactForm" >
<input type="hidden" id = "action" name="action" />
<form:hidden path="id" />
<form:hidden path="ac" />
<form:hidden path="mode" />

	<div id="lbl_name" class="label_div" title="Name."><b>* Name :</b></div>
    <div id="input_name" class="input_name">
    <form:input id="name" path="name" />
    <br>
    <form:errors path="name" cssClass="lbl_error"/>
    </div>
    
    <div id="lbl_phone" class="label_div" title="Phone."><b>* Phone :</b></div>
    <div id="input_phone" class="input_phone">
    <form:input id="phone" path="phone" />
    <br>
    <form:errors path="phone" cssClass="lbl_error"/>
    </div>
    
    <div id="lbl_email" class="label_div" title="Email."><b>* Email :</b></div>
    <div id="input_email" class="input_email">
    <form:input id="email" path="email" />
    <br>
    <form:errors path="email" cssClass="lbl_error"/>
    </div>
    
    <div id="lbl_Interest" class="label_div" title="Interests"><b>* Interests :</b></div>
    <div id="text_reason" class="scroll_checkboxes">
    	<c:forEach var="item" items="${contactForm.reasonList}">
    	<div id="lbl_item_check1" class="label_item_check">
    		<form:checkbox value="${item.description}" path="reasonDescriptions" /> <c:out value="${item.description}" /> <br>
    	</div>
    	</c:forEach>
    </div>
    <br>
    <form:errors path="reasonDescriptions" cssClass="lbl_error"/>

    <br>
    
    <div id="lbl_Departamento" class="label_div" title="Departamento"><b>* Departamentos :</b></div>
    <form:select id="departamento" path="idDepartamento" onchange="cargarCombox();">
    	<form:option value="-1" label="-- Select value --"/>
    	<form:options items="${contactForm.departamentoList}" itemValue="id" itemLabel="name" />
    </form:select>

    <div id="lbl_Provincia" class="label_div" title="Provincias"><b>* Provincias :</b></div>
    <form:select id="idProvincia1" path="idProvincia">
    	<form:option value="-1" label="-- Select value --"/>
    	<form:options items="${contactForm.distritoList}" itemValue="id" itemLabel="name" />
    </form:select>


<div id="pivote" style="display:none;"></div>

   	<div id="input_save" class="input_save">
			<input type="button" name="Submit" value="Save" class="button2" onclick="javascript:saveContact();" />
	</div>
	
	
	
</form:form>